<template>
  <div class="user-wrapper">
    <Login v-if="!userInfo.username" />
    <UserInfo v-if="userInfo.username" />
    <!-- <Register v-if="showRegister" /> -->
  </div>
</template>

<script>
import { reactive, toRefs, computed } from 'vue'
import Login from './sections/Login'
import UserInfo from './sections/UserInfo'
// import Register from './sections/Register'
import { useStore } from 'vuex'
export default {
  components: {
    Login,
    UserInfo
    // Register
  },
  setup() {
    const store = useStore()
    let userInfo = computed(() => {
      return store.getters.userInfo
    })
    let state = reactive({
      //   showRegister: false
    })
    return {
      ...toRefs(state),
      userInfo
    }
  }
}
</script>

<style>
</style>
